const app = getApp()

import * as echarts from "../../../components/echarts/echarts.min"

function lineChart(chart, data) {
  console.log(data);
  var option = {
    //悬浮卡片
    tooltip: {
      trigger: 'axis', //坐标轴触发
      axisPointer: {
        type: 'none'
      },
    },
    grid: {
      left: '5%',
      right: '0%',
      bottom: '5%',
      top: '8%',
      containLabel: true
    },
    xAxis: {
      type: 'category',
      data: data.xData,
      axisLabel: {
        show: true,
        rotate: 40, //35度角倾斜显示
        interval: 0,
        fontSize: 12,
        color: '#fff'
      },
      axisLine: {
        lineStyle: {
          color: '#fff', //x轴的颜色
        },
      },
    },
    yAxis: {
      type: 'value',
      axisLabel: {
        show: true,
        fontSize: 10,
        color: '#fff'
      },
      minInterval: 1

    },
    series: [{
      // data: [150, 230, 224, 218, 135, 147, 260],
      data: data.yData,
      type: 'line',
      lineStyle: {
        // 阴影部分
        shadowOffsetX: 0,
        shadowOffsetY: 15,
        shadowBlur: 5, // 折线模糊
        shadowColor: "rgba(145, 132, 132, 0.2)", //颜色
        color: 'rgb(250, 146, 47)'
      },
      itemStyle: {
        color: '#B756'
      },
      areaStyle: {
        normal: {
          // color: 'linear-gradient(0deg, #018AF4, rgba(77,105,231,0.02))' //改变区域颜色
          color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
            offset: 0,
            color: '#40CFFF' // 0% 处的颜色
          }, {
            offset: 1,
            color: 'rgba(77,105,231,0.02)' // 100% 处的颜色
          }]), //
        }
      },
      smooth: true
    }]
  };
  chart.setOption(option);

  return chart;
}



Page({

  /**
   * 页面的初始数据
   */
  data: {
    path: app.globalData.path,
    recordList: [], //
    visit7: 0,
    newVisit: 0,
    dayList: [],
    ec: {}
  },

  initChart(data) {
    this.selectComponent('#echartsBox').init((canvas, width, height, dpr) => {
      const chart = echarts.init(canvas, null, {
        width: width,
        height: height,
        devicePixelRatio: dpr
      });
      lineChart(chart, data)
      this.chart = chart;
      canvas.setChart(chart);
      return chart;
    })
  },



  checkDetail(e) {
    var index = e.currentTarget.dataset.index,
      list = this.data.recordList;

    console.log(list[index]);

    list[index].customerPosition = list[index].visitPosition
    list[index].customerLong = list[index].visitLong
    list[index].customerLat = list[index].visitLat

    wx.navigateTo({
      url: '/customerPackage/pages/customerDetail/customerDetail?customer=' + JSON.stringify(list[index]),
    })
  },

  getRecord() {
    var url = app.globalData.url + "customer/listCustomerVisitBySeven",
      that = this,
      visit7 = 0,
      newVisit = 0,
      dayList = this.data.dayList;
    wx.showLoading({
      title: '',
    })
    app.wxRequest(url, {
        userId: app.globalData.userId,
      }, res => {
        console.log(res);
        if (res.flag) {
          var res = res.data
          res.sort((a, b) => {
            return b.visitDate - a.visitDate
          })
          wx.hideLoading()
          res.forEach(item => {
            dayList.forEach(d => {
              if (item.visitDate.split(' ')[0] == d.label) {
                if (item.isFirst == 1) {
                  newVisit += 1
                }
                d.value += 1
                visit7 += 1
              }
            })
          })

          var obj = {
            xData: [],
            yData: [],
          }

          dayList.forEach(item => {
            obj.xData.push(item.date)
            obj.yData.push(item.value)
          })

          wx.hideLoading()
          console.log(res);

          that.initChart(obj)

          console.log(res);
          that.setData({
            recordList: res.reverse(),
            dayList,
            visit7,
            newVisit
          })
        }
      },
      err => {
        console.log(err);
      })
  },



  getNow: function () {
    var date = new Date()
    var year = date.getFullYear()
    var month = this.add0(date.getMonth() + 1)
    var date = this.add0(date.getDate())
    var str = year + '-' + month + '-' + date
    this.getDate(str);
  },

  getDate: function (str) {
    console.log(str);
    var that = this
    let now = new Date(); // 
    let day = now.getDay(); //判断今天是周几
    let oneDayTime = 24 * 60 * 60 * 1000; //一天的时间
    let nowTime = Date.parse(str.replace(/-/g, "/") + ' ' + '00' + ':' + '00' + ':' + '00'); // 当天的时间戳
    var list = []
    for (var i = 0; i < 7; i++) {
      list[i] = {
        date: that.format(nowTime - i * oneDayTime, 0),
        label: that.format(nowTime - i * oneDayTime, 1),
        value: 0,
      }
    }
    console.log(list);
    list.reverse()

    this.setData({
      dayList: list
    })
  },
  add0: function (m) {
    return m < 10 ? '0' + m : m
  },
  format: function (shijianchuo, id) {
    //shijianchuo是整数，否则要parseInt转换
    var time = new Date(shijianchuo);
    var y = time.getFullYear();
    var m = this.add0(time.getMonth() + 1);
    var d = this.add0(time.getDate());
    return id == 0 ? m + '-' + d : y + '-' + m + '-' + d;
    // return id == 0 ? d : m + '-' + d;
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad(options) {
    this.getNow()
    this.getRecord()
  },

  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady() {

  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow() {

  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide() {

  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload() {

  },

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh() {

  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom() {

  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage() {

  }
})